<template>
    <div class="order">
		<!-- 公共标题 -->
		<div class="common-tel">
			收货人信息
			<div class="common-tel-dot">
				<em></em>
				<em></em>
				<em></em>
			</div>
		</div>
		<!-- 收货人信息 -->

		<div class="common-form" v-if=" add.status != 400 ">
			<div class="order-info">
				<a  class="order-info-a" @click="switchTo('/AddressList')"></a>
				<div class="order-info-name">
					{{add.name}}  {{add.tel}}
				</div>
				<div class="order-info-add">
					<label>地址：</label>
					<span>{{add.province}}{{add.city}}{{add.area}}{{add.address}}</span>
				</div>
			</div>
		</div>
		<div class="common-form" v-else>
			<!-- <router-link :to="'/AddressAdd'" > -->
				<div class="order-info-none" @click="switchTo('/orderAdd')"><em>+</em>添加收货地址</div>
			<!-- </router-link>  -->
		</div>
		<!-- 公共标题 -->
		<div class="common-tel">
			商品信息
			<div class="common-tel-dot">
				<em></em>
				<em></em>
				<em></em>
			</div>
		</div>
		<!-- 商品信息 -->
		<div class="common-form" v-for="item in detail">
			<div class="order-shop">
				<p class="order-shop-tel"><i></i>商品信息</p>
				<div class="order-shop-info">
					<img :src="url + item.data.thumbnail">
					<div>
						<p>{{item.data.goods_title}}</p>
						<p>{{item.data.spec_2}} {{item.data.spec_1}} {{item.data.quantity}}件</p>
						<p>
							<a v-if="vip == 0">￥{{item.data.market_price}}</a>
							<a v-else>￥{{item.data.vip_price}}</a>
						</p>
					</div>
				</div>
				<div class="order-shop-more">购买数量 <em>{{item.data.quantity}}</em></div>
				<div class="order-shop-more">运费 <em>{{price}}</em></div>
				<div class="order-shop-more">商品金额
					<a v-if="vip == 0" class="order-shop-more-p">￥{{item.data.market_price}}</a>
					<a class="order-shop-more-p" v-else>￥{{item.data.vip_price}}</a>
				</div>
				<div class="order-shop-more">买家留言 <input type="text" placeholder="选填" /></div>
			</div>
		</div>
		<!-- 公共标题 -->
		<!-- <div class="common-tel">
			支付方式
			<div class="common-tel-dot">
				<em></em>
				<em></em>
				<em></em>
			</div>
		</div> -->
		<!-- 支付方式 -->
		<!-- <div class="common-form">
			<div class="order-pay">
				<img src="build/img/1.jpg" alt="" />
				<div>
					<p>微信支付</p>
					<p>微信支付  更快更安全</p>
				</div>
				<em></em>
			</div>
			<div class="order-pay">
				<img src="build/img/2.jpg" alt="" />
				<div>
					<p>微信支付</p>
					<p>微信支付  更快更安全</p>
				</div>
				<em class="order-pay-pink"></em>
			</div>
		</div> -->
		<div class="footer-100"></div>
		<!-- 支付 -->
		<div class="order-footer">
			<div>
				实付款：<span>￥<em>{{Number(total_price) + Number(price)}}</em></span>
			</div>
			<a @click="pay">立即支付</a>
		</div>
	</div>
</template>

<script>
import axios from "axios";
import qs from 'qs'
import url from 'url'
import wx from 'weixin-jsapi'
    export default {
		name:'',
		data () {
            return {
				add:{},
				firm:[],
				url:'http://api.huiwanzhong365.com',
				detail:[],
				total_price:'',
				price:'',
				vip:''
            }
		},
		methods:{
			switchTo(path){
				// console.log(this.$router)
				this.$router.push(path)
			},

			//获取收货地址
			getAdd:function(){
				var that = this
				var openid = localStorage.getItem("openid")
				//console.log(openid)
                var upload = {
                    openid:openid,
                }
                this.$http.post('/vipmember/index/getDefaultAddress',qs.stringify(upload)).then(rs=>{
					//console.log(rs.data)
					this.add = rs.data
					//console.log(rs.data.province)
					this.yunfei(rs.data.province)
                }).catch(err=>{
                    console.log(err)
                })
			},

			//查看运费
			yunfei:function(province){
				var that = this
				//console.log(this.add.province)
				var openid = localStorage.getItem("openid")
				//console.log(openid)
                var upload = {
					openid:openid,
					province:province,
					goods_id:this.$route.query.id
                }
                this.$http.post('/index/merchant/goods/query_freight',qs.stringify(upload)).then(rs=>{
					console.log(rs.data)
					this.price = rs.data.price
					//this.add = rs.data
                }).catch(err=>{
                    console.log(err)
                })
			},
			// 确认订单信息
			confirm:function(){
				// console.log(this.$route.params.id)
				console.log(this.$route.query.id)
				var that = this
				var openid = localStorage.getItem("openid")
				var firm2 = {
							goods_id:this.$route.query.id,
							attr_id:this.$route.query.s,
							quantity:this.$route.query.quantity
						}
				this.firm.push(firm2)
				//console.log(JSON.stringify(this.firm))
                var upload = {
					openid:openid,
					list:JSON.stringify(this.firm),
                }
                this.$http.post('/index/merchant/goods/affirmOrder',qs.stringify(upload)).then(rs=>{
					//console.log(rs.data.list)
					//this.add = rs.data
					this.detail = rs.data.list
					//console.log(this.detail)
					this.total_price = rs.data.total_price
					this.vip = rs.data.vip
                }).catch(err=>{
                    console.log(err)
                })
			},
			pay:function(){
				//console.log()
				var openid = localStorage.getItem("openid")
				var data = {
					goods:[
						{
							goods_id:this.$route.query.id,
							attr_id:this.$route.query.s,
							quantity:this.$route.query.quantity
						}
					],
					address:[
						{
							addressee:this.add.name,
							number:this.add.tel,
							province:this.add.province,
							city:this.add.city,
							area:this.add.area,
							address:this.add.address
						}
					]
				}
				//console.log(JSON.stringify(data))
				//console.log()
				if(this.add.status == 400){
					layer.msg(this.add.info);
				}else{
					var upload = {
						openid:localStorage.getItem("openid"),
						list: JSON.stringify(data)
					}
					this.$http.post('/index/merchant/goods/memberOrder',qs.stringify(upload)).then(res=>{
						//console.log(res.data)
						// if(res.data.status = 400){
						// 	layer.msg(res.data.info);
						// }else{
							layer.msg(res.data.info);
							wx.chooseWXPay({
							// appId:res.data.appId,
								timestamp:res.data.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
								nonceStr: res.data.nonceStr, // 支付签名随机串，不长于 32 位
								package:res.data.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
								signType: 'MD5', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
								paySign: res.data.paySign, // 支付签名
								success: function (res) {
									// 支付成功后的回调函数
									console.log('pay success');
									this.$router.push({name:'vipOrderList'});
								},
								error: function (res) {
									// 支付失败的回调函数
									console.log(res);
									//alert(res.errMsg);
								}
							});
						// }

					}).catch(err=>{
						console.log(err)
					})
				}

			},
		},
		mounted(){
			this.getAdd();
			this.confirm();
			//this.yunfei();
		}
    }
</script>

<style scoped>
.order-shop-more-p{
	float:right;
}
</style>
